/*
 * @Description: 定义父级模板
 * @Version: 1.0
 * @Author: 琴时
 * @Date: 2021-11-25 11:20:52
 * @LastEditors: 琴时
 * @LastEditTime: 2021-11-25 12:56:45
 * @FilePath: \pt-utils\react-demo\src\layouts\index.tsx
 */

import { PureComponent } from 'react';
import { Layout, Breadcrumb, Menu } from 'antd'; // 布局容器 导航菜单
// import styles from './index.less';
export default class BasicLayout extends PureComponent {
  state = {
    collapsed: false,
  };

  onCollapse = (collapsed: boolean) => {
    console.log(collapsed);
    this.setState({ collapsed });
  };

  render() {
    const { children } = this.props;

    return (
      <Layout style={{ minHeight: '100vh' }}>
        {/* <Sider
          collapsible
          collapsed={this.state.collapsed}
          onCollapse={this.onCollapse}
        >
          <div className={styles.logo} />
          <MenuComponent />
        </Sider> */}
        <Layout>
          {/* <Header style={{ background: '#fff', padding: 0 }} /> */}
          <div style={{ margin: '0 16px' }}>
            <Breadcrumb style={{ margin: '16px 0' }}>
              <Breadcrumb.Item>User</Breadcrumb.Item>
              <Breadcrumb.Item>index</Breadcrumb.Item>
            </Breadcrumb>
            <div style={{ padding: 24, background: 'skyblue', minHeight: 360 }}>
              {children}
            </div>
          </div>
          {/* <Footer style={{ textAlign: 'center' }}>
            Ant Design ©2018 Created by Ant UED
          </Footer> */}
        </Layout>
      </Layout>
    );
  }
}
